/** 任务跟进 */

import {Collapse, Button, Space, message} from 'antd'
import React, {forwardRef, useEffect, useState} from 'react'
import type {ColumnsType} from 'antd/es/table'
import {getPublicDownloadUrl} from '@/service/common/upload'
import styles from './index.less'
import CustomTable from '@/components/Table'
import {
	getStocktakeTaskList,
	stocktakeTaskReset,
	stocktakeTaskTip,
} from '@/service/storage/assetInventoryPlan'
import {downloadImages} from './bulkDownload'

const {Panel} = Collapse

type PropsType = {
	planId: string
}

const taskFollowUp = (props: PropsType) => {
	const {planId} = props
	const [dataSource, setDataSource] = useState<any[]>([])
	const [loading, setLoading] = useState(false)
	const [columns, setColumns] = useState<ColumnsType<any>>([])
	const [params, setParams] = useState({
		current: 1,
		size: 10,
	})

	const getData = () => {
		setLoading(true)
		getStocktakeTaskList({planId})
			.then((res: any) => {
				if (res?.success) {
					const urls: any = []
					const newData = [...res.data]
					res?.data.forEach(
						(
							item: {[x: string]: any; taskAnnexList: any[]},
							index: number,
						) => {
							item?.taskAnnexList?.forEach((items) => {
								urls.push(Number(items?.url))
								newData[index][items.name] =
									items.uploadStatusName
							})
						},
					)
					if (urls?.length) {
						getPublicDownloadUrl(urls).then((result: any) => {
							if (result?.success) {
								const newAnnexList = [...newData]
								newAnnexList?.forEach((item: any, index) => {
									newData[index].urlDatas = []
									item?.taskAnnexList?.forEach(
										(items: any) => {
											const urlData = result?.data?.find(
												(urlItem: any) =>
													urlItem?.id ===
													Number(items?.url),
											)
											if (urlData) {
												newData[index].urlDatas.push(
													urlData,
												)
											}
										},
									)
								})
							}
						})
					}
					setDataSource(newData)
					setLoading(false)
				} else {
					setLoading(false)
				}
			})
			.catch((err) => {
				setDataSource([])
				message.error(err)
				setLoading(false)
			})
	}

	useEffect(() => {
		getData()
	}, [params])

	/** 任务重置 */
	const onReset = (id: string | number) => {
		stocktakeTaskReset({taskId: id})
			.then((res: any) => {
				if (res.success) {
					message.success(res.msg)
					getData()
				}
			})
			.catch(() => {})
	}
	/** 任务提醒 */
	const onRemind = (id: string | number) => {
		stocktakeTaskTip({taskId: id})
			.then((res: any) => {
				if (res.success) {
					message.success(res.msg)
				}
			})
			.catch(() => {})
	}

	useEffect(() => {
		const newColumns: any[] = [
			{
				title: '人员名称',
				dataIndex: 'username',
				align: 'center',
				width: 100,
			},
			{
				title: '联系方式',
				dataIndex: 'phone',
				align: 'center',
				width: 120,
			},
			{
				title: '人员职位',
				dataIndex: 'positionName',
				align: 'center',
				width: 120,
			},
			{
				title: '所属公司',
				dataIndex: 'orgName',
				align: 'center',
				width: 150,
			},
			{
				title: '所属部门',
				dataIndex: 'departmentName',
				align: 'center',
				width: 120,
			},
			{
				title: '任务编号',
				dataIndex: 'taskId',
				align: 'center',
				width: 120,
			},
			{
				title: '任务状态',
				dataIndex: 'taskStatus',
				align: 'center',
				width: 100,
				render: (text: number) => {
					if (text === 0) {
						return '待开始'
					}
					if (text === 1) {
						return '进行中'
					}
					if (text === 2) {
						return '已完成'
					}
					return '已逾期'
				},
			},
			{
				title: '反馈时间',
				dataIndex: 'feedbackTime',
				align: 'center',
				width: 160,
				render: (text: any, record: {taskStatus: number}) =>
					record?.taskStatus === 2 ? text : '-',
			},
			{
				title: '盘点人',
				dataIndex: 'stockmanName',
				align: 'center',
				width: 100,
			},
			{
				title: '监盘人',
				dataIndex: 'supervisorName',
				align: 'center',
				width: 120,
			},
			{
				title: '附件上传状态',
				width: 500,
				align: 'center',
				children: [],
			},
			{
				title: '操作',
				key: 'action',
				align: 'center',
				fixed: 'right',
				width: 180,
				render: (_: any, record: any) => (
					<Space size={12}>
						{record?.taskStatus === 2 ? (
							<>
								<Button
									type="link"
									onClick={() => {
										downloadImages(record?.urlDatas)
									}}>
									批量下载
								</Button>
								<Button
									type="link"
									onClick={() => {
										onReset(record?.taskId)
									}}>
									任务重置
								</Button>
							</>
						) : (
							''
						)}
						{record?.taskStatus === 1 ||
						record?.taskStatus === 3 ? (
							<Button
								type="link"
								onClick={() => {
									onRemind(record?.taskId)
								}}>
								任务提醒
							</Button>
						) : (
							''
						)}
					</Space>
				),
			},
		]

		dataSource?.[0]?.taskAnnexList?.forEach((item: any) => {
			newColumns[10]?.children?.push({
				title: item?.name,
				dataIndex: item?.name,
				width: 120,
				align: 'center',
			})
		})
		setColumns(newColumns)
	}, [dataSource])

	const customizeHeader = (value: string) => (
		<div>
			<div className={styles.tip} />
			{value}
		</div>
	)

	return (
		<div className={styles.addPlan}>
			<Collapse
				defaultActiveKey={['1', '2', '3']}
				ghost
				expandIconPosition="end"
				collapsible="header">
				<Panel header={customizeHeader('任务跟进')} key="1" forceRender>
					<CustomTable
						params={params}
						columns={columns}
						callback={(pagination: any) => {
							setParams(pagination)
						}}
						loading={loading}
						pagination={false}
						dataSource={dataSource}
					/>
				</Panel>
			</Collapse>
		</div>
	)
}

export default forwardRef(taskFollowUp)
